import Vue from 'vue'
import Vuex from 'vuex'
// 导入操作本地存储的函数
import { setToken, getToken, removeToken } from '@/utils/auth'
// 导入接口
import { userInfoAPI } from '@/api'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    // vuex在每次页面一打开或者一刷新
    // 就能从本地存储获取到之前存的token
    // tokenObj: getToken() ? getToken() : {}

    // 左边有值，就获取左边的值，左边没值就用右边的值
    tokenObj: getToken() || {},

    // 保存登录的用户资料
    userInfo: {}
  },

  mutations: {
    changeTokenObj(state, obj) {
      state.tokenObj = obj

      // 还要保存到本地存储
      setToken(obj)
    },

    // 修改用户信息
    changeUserInfo(state, obj) {
      state.userInfo = obj
    },

    logout (state) {

      // 清空vuex里token数据
      state.tokenObj = {}
      // 清除本地存储的token
      removeToken()
    }
  },

  actions: {
    async reqUserInfo(ctx) {
      // 如果没数据才发请求
      if (!ctx.state.userInfo.name) {
        // 发请求获取用户信息
        let res = await userInfoAPI()
        // 把数据存到vuex里
        ctx.commit('changeUserInfo', res.data.data)
      }
    }
  }
})
